<!doctype html>
<html lang="en">

	<head>
		<!-- lang="en" 用于进网页之后的解析中英文 -->
		<meta charset="utf-8">
		<!--移动端优先的适配 配置-->
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

		<!-- Bootstrap CSS 引入 -->
		<link rel="stylesheet" href="bootstrap.css">

		<title>Hello, world!</title>
	</head>

	<body>
		<h1>Hello, world!</h1>
		<a href="#">我是经过bootstrap化的模板超链接标签</a>
		<br>
		<!--
        Bootstrap 自带的很多逻辑 + 样式 都为如a的下划线等常用标签做了最好的配置
    -->
		<!--按钮显示 改变a属性-->
		<a href="#" class="btn btn-default" role="button">Link</a>
		<button class="btn btn-default" type="submit">Button</button>
		<input class="btn btn-default" type="button" value="input" />
		<input class="btn btn-default" type="submit" value="Submit" />

		<button type="button" class="btn btn-default">默认样式default</button>
		<button type="button" class="btn btn-primary">首选项primary</button>
		<button type="button" class="btn btn-success">成功Success</button>
		<button type="button" class="btn btn-info">   一般信息info</button>
		<button type="button" class="btn btn-warning">警告信息warning</button>
		<button type="button" class="btn btn-danger"> 危险信息danger</button>
		<button type="button" class="btn btn-link">   链接link</button>

		<!--尺寸--> 
		<p>
			<button type="button" class="btn btn-primary btn-lg">大型号首选项</button>
			<button type="button" class="btn btn-default btn-large">大型号默认项</button>
		</p>
		<p>
			<button type="button" class="btn btn-primary">（默认尺寸）Default button</button>
			<button type="button" class="btn btn-default">（默认尺寸）Default button</button>
		</p>
		<p>
			<button type="button" class="btn btn-primary btn-sm">（小按钮）Small button</button>
			<button type="button" class="btn btn-default btn-sm">（小按钮）Small button</button>
		</p>
		<p>
			<button type="button" class="btn btn-primary btn-xs">（超小尺寸）Extra small button</button>
			<button type="button" class="btn btn-default btn-xs">（超小尺寸）Extra small button</button>
		</p>
		
		<!--块级状态-->
		<button type="button" class="btn btn-primary btn-lg btn-block">我是块级元素的按钮</button>
		<br>
		
		<!--激活状态-->
		<button type="button" class="btn btn-primary btn-lg active">我是块级元素的按钮</button>
		<button type="button" class="btn btn-default btn-lg active">我是块级元素的按钮</button>
		<br>

		<!--基于a元素-->
		<a href="#" class="btn btn-primary btn-lg active" role="button">Primary link</a>
		<a href="#" class="btn btn-default btn-lg active" role="button">Link</a>
		<!--赋予active一样性质无需前缀的disabled属性-->
		<a href="#" class="btn btn-default btn-lg disabled" role="button">Link</a>
		<br>
		
		<!--禁用状态按钮-->
		<button type="button" class="btn btn-primary btn-lg " disabled="disabled">啊来点我</button>
		<button type="button" class="btn btn-default btn-lg " disabled="disabled">啊来点我</button>
		<br>
		
		
		
		<!-- Optional JavaScript 引入 -->
		<!-- jQuery first, then Popper.js, then Bootstrap JS -->
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
		<!-- Include all compiled plugins (below), or include individual files as needed -->
		<script src="js/bootstrap.min.js"></script>

	</body>

</html>